<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        <!-- 表单标签 -->
        <!-- form标签--当作容器配合表单控件使用 -->
        <form action="后端地址">
            姓名：<input type = "text"><br/>
            密码：<input type = "password"><br/>
            性别：<input type = "radio" name = "sex" checked = "checked" id = "male">
                <label for="male">男</label>
                <input type = "radio" name = "sex" id = "female">
                <label for="female">女</label> <br/>
            爱好：<input type = "checkbox">吃饭
                  <input type = "checkbox">睡觉
                  <input type = "checkbox">打游戏<br/>
                    <input type = "button" value = "这是一个普通按钮" onclick= "alert('hello world')">
                    <br/><input type = "submit" value = "提交">
                    <br/><input type = "reset" value = "重置">
                    <br/><input type = "file"><br/>
            年份：<select >
                <option >请选择年份</option>
                <option selected = "selected">2000</option>
                <option >2001</option>
                <option >2002</option>
                <option >2003</option><br/>
            </select>
            <textarea rows="3" cols="50">111
            </textarea><br/>
            <div>
                <span>咬人猫</span>
                <span>咬人猫</span>
                <span>咬人猫</span>
            </div>
            <div>
                <span>兔总裁</span>
                <span>兔总裁</span>
                <span>兔总裁</span>
            </div>
            <div>
                <span>阿叶君</span>
                <span>阿叶君</span>
                <span>阿叶君</span>
            </div>
        </form>
        <!-- input标签 -->
        <!-- 属性type -->
        <!-- text--文本框 -->
        <!-- password--密码框 -->
        <!-- radio--单选框 -->
        <!-- checkbox--复选框 -->
        <!-- button--按钮  -->
        <!-- submit--提交 -->
        <!-- reset--重置 -->
        <!-- file--提交文件 -->
        <!-- value--按钮名称 -- -->
        <!-- name属性--只能选择一个时，不同单选框name相同 -->
        <!-- checked属性--默认单选框 -->
        <!-- onclick属性--点击出现的事件 -->
        
        <!-- label标签 通过id使文字与按钮关联-->
        <!-- for--填写关联按钮id,可实现点击文字，按钮被点击 -->

        <!-- select标签 -->
        <!-- option--放入下拉框内的数据，selected--默认显示值，没设置默认为第一个 -->

        <!-- textarea标签--长文本框,rows 行 cols 列-->

        <!-- 无语义标签div&span--没有固定用途 -->
        <!-- div--独占一行 -->
        <!-- span--占一块 -->
    </body>
</html>